
import { Button } from 'antd';
import { WeaTab, WeaDialog, WeaSearchGroup, WeaFormItem, WeaNewScroll, WeaAlertPage } from 'ecCom';
import { inject, observer } from "mobx-react";
import { toJS } from 'mobx';

import { WeaTableNew, WeaSwitch } from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import { WeaLocaleProvider } from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class CptFlowLog extends React.Component {
    constructor(props) {
        super(props);
    }
    componentDidMount() {

    }
    componentWillReceiveProps(nextProps) {

    }
    render() {
        const { contentStore } = this.props;
        const { showSearchAd, flowTableStore, flowForm, cptCardCondition, cptFlowDeltail, showCptFlowDetail, hasFlowRight, hasVerified } = contentStore;
        const formParams = flowForm.getFormParams() || {};
        if (hasVerified && !hasFlowRight) {
            return (
                <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@grziyv`} >
                    <div style={{ color: '#000' }}>
                        {getLabel(2012, '对不起，您暂时没有权限！')}
                    </div>
                </WeaAlertPage>
            )
        }
        if (hasVerified && hasFlowRight) {
            return (
                <div >
                    <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@wccwr4`}
                        buttonsAd={this.getAdButtons()}
                        searchType={['advanced']}
                        setShowSearchAd={bool => {
                            contentStore.setShowSearchAd(bool)
                        }}
                        hideSearchAd={() => contentStore.setShowSearchAd(false)}
                        searchsAd={
                            <div>{this.getCondition()}</div>
                        }
                        showSearchAd={showSearchAd}
                    />
                    <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@npkh4s`}
                        comsWeaTableStore={flowTableStore}
                        hasOrder={true}
                        needScroll={true}
                        onOperatesClick={this.onOperatesClick.bind(this)}
                    />
                    <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@vyvvph`}
                        title={getLabel(1293, "查看详细信息")}
                        visible={cptFlowDeltail}
                        buttons={this.getBottomButtons()}
                        icon="icon-coms-fa"
                        iconBgcolor="#f14a2d"
                        onCancel={() => { showCptFlowDetail(false) }}
                        style={{ width: 800, height: 550 }}
                    >
                        <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@a386js`} height={"100%"}>
                            {cptFlowDeltail && this.getDetailInfo()}
                        </WeaNewScroll>
                    </WeaDialog>
                </div>
            )
        }
        return (<div></div>)
    }
 


    getAdButtons = () => {
        const { contentStore } = this.props;
        const { getFlowLogList, setShowSearchAd, clearFormFields1 } = contentStore;
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@u7ocs3@search`} type="primary" onClick={() => { getFlowLogList(); setShowSearchAd(false); }}>{getLabel(197, '搜索')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@gr08he@reset`} type="ghost" onClick={() => { clearFormFields1(); }}>{getLabel(2022, '重置')}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@69nfbg@close`} type="ghost" onClick={() => { setShowSearchAd(false) }}>{getLabel(201, '取消')}</Button>)
        ];
    }
    getCondition = () => {
        const { cptCardCondition, flowForm } = this.props.contentStore;
        const { isFormInit } = flowForm;
        let group = [];
        const formParams = flowForm.getFormParams();
        isFormInit && cptCardCondition.map((c,i) => {
            let items = [];
            c.items.map((fields, index) => {
                items.push({
                    com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@4ob0i2@${index}`}
                        label={`${fields.label}`}
                        labelCol={{ span: `${fields.labelcol}` }}
                        wrapperCol={{ span: `${fields.fieldcol}` }}>
                        <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@kmpacn@${index}`} fieldConfig={fields} form={flowForm} onEnterSearch={this.onEnterSearch}/>
                    </WeaFormItem>),
                    colSpan: 1,
                })
            });
            group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@9m7pbz@${i}`} needTigger={true} title={c.title} showGroup={c.defaultshow} items={items} />)
        });
        return group;
    }
    onOperatesClick(record, index, operate, flag) {
        const { showCptFlowDetail } = this.props.contentStore;
        if (flag == "0") {  //查看日志详情
            showCptFlowDetail(true, record.randomFieldId)
        }
    }
    getBottomButtons() {
        const { showCptFlowDetail } = this.props.contentStore;
        let btn = [];
        btn.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ybteoi@close`} type="primary" onClick={() => { showCptFlowDetail(false) }}>{getLabel(309, "关闭")}</Button>);
        return btn;
    }
    getDetailInfo = () => {
        const { flowDetailForm, flowDetailCondition } = this.props.contentStore;
        const { isFormInit } = flowDetailForm;
        let group = [];
        isFormInit && flowDetailCondition.map((c,i) => {
            let items = [];
            c.items.map((fields, index) => {
                let hasunderline = false;
                if (fields.viewAttr == "1" || (fields.conditionType == "BROWSER" && fields.browserConditionParam.viewAttr == "1")) {
                    hasunderline = true
                }
                if (hasunderline) {
                    items.push({
                        com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@5ukq3s@${index}`}
                            label={`${fields.label}`}
                            labelCol={{ span: `${fields.labelcol}` }}
                            wrapperCol={{ span: `${fields.fieldcol}` }} underline>
                            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@kz16iv@${index}`} fieldConfig={fields} form={flowDetailForm} />
                        </WeaFormItem>),
                        colSpan: 1,
                    })
                } else {
                    items.push({
                        com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@49rkvf@${index}`}
                            label={`${fields.label}`}
                            labelCol={{ span: `${fields.labelcol}` }}
                            wrapperCol={{ span: `${fields.fieldcol}` }}>
                            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@6jkknp@${index}`} fieldConfig={fields} form={flowDetailForm} />
                        </WeaFormItem>),
                        colSpan: 1,
                    })
                }
            });
            group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@hwklvk@${i}`} needTigger={true} col={1} title={c.title} showGroup={c.defaultshow} items={items} />)
        });
        return group;
    }

    onEnterSearch = () =>{
        const { getFlowLogList, setShowSearchAd } = this.props.contentStore;
        getFlowLogList();
        setShowSearchAd(false);
    }

}

